<template>
  <vo-table ref="voTable" :data="data.tableData">
    <template #leftBar>
      <tiny-form :inline="true" class="demo-form-inline" label-position="left" v-model="searchForm">
        <tiny-form-item label="执行器" label-width="50px">
          <vo-select default select dictCode="jobExcetor" v-model:value="data.searchForm.spaceId" />
        </tiny-form-item>
        <tiny-form-item>
          <tiny-form-item label="名称" label-width="40px">
            <tiny-input v-model="data.searchForm.ruleName" placeholder="规则名称"></tiny-input>
          </tiny-form-item>

          <tiny-form-item label="状态" label-width="40px">
            <tiny-input v-model="data.searchForm.ruleName" placeholder="规则名称"></tiny-input>
          </tiny-form-item>

          <tiny-button type="primary" @click="queryTaskJob">查询</tiny-button>
        </tiny-form-item>
      </tiny-form>
    </template>
    <template #rightBar>
      <tiny-button-group>
        <tiny-button type="primary" @click="addJob"> 新增</tiny-button>
      </tiny-button-group>
    </template>

    <template v-slot:handleSlot="{ row }">
      <tiny-button type="text" size="mini" @click="start(row)">启动 </tiny-button>
      <tiny-dropdown size="mini">
        更多操作
        <template #dropdown>
          <tiny-dropdown-menu>
            <tiny-dropdown-item @click="triger(row)">执行一次</tiny-dropdown-item>
            <tiny-dropdown-item @click="lookLog(row)">查询日志</tiny-dropdown-item>
            <tiny-dropdown-item @click="resgistry(row)">注册节点</tiny-dropdown-item>
            <tiny-dropdown-item>下次执行时间</tiny-dropdown-item>
            <tiny-dropdown-item @click="editJob(row)">编辑</tiny-dropdown-item>
            <tiny-dropdown-item @click="removeJob(row)">删除</tiny-dropdown-item>
            <tiny-dropdown-item @click="copyJob(row)">复制</tiny-dropdown-item>
          </tiny-dropdown-menu>
        </template>
      </tiny-dropdown>
    </template>
  </vo-table>
  <vo-dialog :data="data.edit.config" v-model:isShow="data.edit.isShow">
      <job-edit :data="data.edit.data" v-model:isShow="data.edit.isShow" />
  </vo-dialog>
</template>

<script setup>
import { Modal } from '@opentiny/vue';
import JobEdit from './JobEdit.vue';
import { ref, reactive, toRefs, onMounted, getCurrentInstance } from 'vue';
let { proxy } = getCurrentInstance();
const data = reactive({ edit:{config:{width:'800px'},data:{},isShow:false},searchForm: {}, tableData: { data: [], cols: [], tableArrts: {} } });

data.tableData.cols = [
  { type: 'index' },
  { title: '任务ID', key: 'id', width: 120, align: 'left', tooltip: true },
  { title: '任务名称', key: 'jobDesc', width: 120, align: 'left', tooltip: true },
  { title: '执行器', key: 'jobGroup', width: 120, align: 'left', tooltip: true },
  { title: '调度类型', key: 'scheduleType', align: 'left' },
  { title: '运行模式', key: 'glueType', align: 'left', tooltip: true },
  { title: '负责人', key: 'author', align: 'left', tooltip: true },
  { title: '状态', key: 'triggerStatus', tooltip: true, align: 'center', },
  { title: '操作', slot: 'handleSlot', width: 250 },
];
onMounted(() => {
  //加载查询
  queryTaskJob();

})
const addJob = ()=>{
  data.edit.isShow=true;
  data.edit.data={};

}
// 任务查询
const queryTaskJob = () => {
  proxy.$api.taskJob.queryJobInfo(data.searchForm).then(res => {
    data.tableData.data = res; //更新数据
  });
}
const lookLog=()=>{
  alert("查询日志")
}
const resgistry = ()=>{
  alert("查询注册")
}
const editJob = (row)=>{
  alert("任务编辑")
}
const removeJob = (row)=>{
  alert("任务删除")
}
const copyJob = (row)=>{
  alert("任务复制")
}
const start = row => {
  Modal.confirm('您确定要启动吗？').then(res => {
        if (res == 'confirm') {
           proxy.$api.taskJob.start(row).then(res => {
          });
        }
      })
  
};
// 启动一次
const triger = row => {
  Modal.confirm('是否启动一次').then(res=>{
    if(res=='confirm'){
       proxy.$api.taskJob.trigger(row).then(res => {
          });
    }
  })
};
</script>
<style lang="scss" scoped>
.demo-form-inline {
  .tiny-form-item {
    margin-bottom: 0 !important;
  }
}
</style>
